<template>
	<view class="selected_activities">
		<view class="sa_list" v-if="dataList.length!=0">
			<view class="sa_item" v-for="(item,index) in dataList" @click="jump(item)">
				<view class="sa_item_img">
					<image class="imgBox" :src="item.img"></image>
				</view>
				<view class="sa_item_title">{{item.name}}</view>
			</view>
		</view>
		<block v-else>
			<view class="no_info">
				<image src="/static/my/news_no.png" mode="widthFix"></image>
				<text>暂无活动</text>
			</view>
		</block>
		<view class="shenye_footer">
			<view class="footer_item" @click="jumpInfo(1)" >
				<image src="/static/home.png" mode=""></image>
				<text>返回首页</text>
			</view>
			<view class="footer_item" @click="jumpInfo(2)">
				<image src="/static/my.png" mode="" ></image>
				<text>我的</text>
			</view>
		</view>
	</view>
</template>

<script>
	import { getActivityList } from '@/api/api-v1-2.js'
	export default {
		data() {
			return {
				dataList: [],
				pageSize: 10, //每页记录数
				pageNum: 1, //当前页码
				listTotal: 0, //列表总数
			}
		},
		onLoad() {
			this.getDataList()
		},
		onShow() {
			window.onpageshow = function(event) {
				if (event.persisted) {
					window.location.reload()
				}
			}
		},
		methods: {
			async getDataList() {
				uni.showLoading({
					title: '加载中'
				})
				var _this = this
				let data = {
					pageSize: this.pageSize,
					pageNum: this.pageNum
				}
				try {
					const res = await getActivityList(data);
					uni.hideLoading()
					this.listTotal = res.result.total
					var el = res.result.records
					if (this.pageNum > 1) {
						this.dataList = this.dataList.concat(el); //将数据拼接在一起
					} else {
						this.dataList = el
					}
				} catch {
					uni.hideLoading()
				} finally {
					setTimeout(res => {
						uni.hideLoading()
					}, 4000)
				}
			},
			// 跳转详情
			jump(item) {
				if(item.url != ''){
					let platform=uni.getSystemInfoSync().platform
					if(platform=='ios'){
						  // console.log('我是iOS')
						  window.location.href =  item.url
					}else if(platform=='android'){
						var urlData = '/' + item.url.split('/').slice(3).join('/');
						  // console.log('我是安卓')
						 uni.navigateTo({
						    url:urlData
						 })
					}
					// return
					// if(item.url == '/pages/pay/blindbox'){
					// 	let platform=uni.getSystemInfoSync().platform
					// 	if(platform=='ios'){
					// 		  // console.log('我是iOS')
					// 		  window.location.href =  "/pages/pay/blindbox"
					// 	}else if(platform=='android'){
					// 		  // console.log('我是安卓')
					// 		 uni.navigateTo({
					// 		    url:item.url
					// 		 })
					// 	}
					// }else{
					// 	var urlData = '/' + item.url.split('/').slice(3).join('/');
					// 	uni.navigateTo({
					// 	   url:urlData
					// 	})
					// 	// window.location.href = item.url
					// }
				}
			},
			jumpInfo(index){
				if(index == 1){
					uni.reLaunch({
						url:'/pages/index/index'
					})
				}else{
					uni.reLaunch({
						url:'/pages/my/my'
					})
				}
			}
		},
		// 页面上拉触底事件的处理函数
		onReachBottom: function() {
			// console.log("触底了", this.pageNum, Math.ceil(this.listTotal / this.pageSize), this.listTotal)
			if (this.pageNum >= Math.ceil(this.listTotal / this.pageSize)) {
				// this.moreShop = 'noMore'
			} else {
				// this.moreShop = 'more'
				this.pageNum++; //每触底一次 page + 1;
				this.getDataList()
			}
		}
	}
</script>

<style scoped>
	page{
		background: #FAFAFA;
	}
	.selected_activities{
		padding-top: 40rpx;
		padding-bottom: 200rpx;
		background: #FAFAFA;
	}
	.sa_item{
		width: 690rpx;
		margin: 0 auto;
		background: #FFFFFF;
		border-radius: 8rpx;
		padding: 30rpx;
		box-sizing: border-box;
		margin-bottom: 30rpx;
	}
	.sa_item .sa_item_img{
		width: 630rpx;
		height: 300rpx;
		border-radius: 24rpx;
		overflow: hidden;
	}
	.sa_item .sa_item_title{
		font-size: 32rpx;
		margin-top: 30rpx;
		color: #222222;

	}
	/* footer */
	.shenye_footer{
		position: fixed;
		bottom: 0;
		z-index: 10;
		display: flex;
		flex-direction: row;
		justify-content: center;
		background: #ffffff;
		width: 100%;
		height: 148rpx;
	}
	.footer_item{
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 24rpx;
		color: #4D4D4D;
		text-align: center;
		margin-top: 20rpx;
	}
	.footer_item:first-child{
		margin-right: 236rpx;
	}
	.footer_item image{
		width: 44rpx;
		height: 44rpx;
		margin-bottom: 10rpx;
	}
</style>
